/* 全局引用 */
@primary-color: #52b0a6; // 全局主色
@link-color: #52b0a6; // 链接色
@login-color: #00aa9d; // 登录按钮
@gray: #f5f5f7; //灰色背景
@primary-hover: #48c3ba; // 悬浮颜色
@box-shadow: rgba(82,176,166,20%);
@success-color: #52c41a; // 成功色
@warning-color: #f3ae3c; // 警告色
@error-color: #d45048; // 错误色
@heading-color: rgba(0, 0, 0, 0.85); // 标题色
@white: #fff;


// ant 样式覆盖
.contentOuter .ant-btn-primary {
    color: @white;
    background-color: @primary-color;
    border-color: @primary-color;
}
.ant-menu-dark .ant-menu-item, .ant-menu-dark .ant-menu-item-group-title, .ant-menu-dark .ant-menu-item > a {
    color: @primary-color;
}
.ant-menu-dark .ant-menu-item:hover {
    background: @primary-color;
}
.contentOuter .ant-input:hover {
    border-color: @primary-color;
}
.contentOuter .ant-input:focus {
    border-color: @primary-color;
    box-shadow: 0 0 0 2px @box-shadow;
}
.contentOuter .ant-input-affix-wrapper:hover .ant-input:not(.ant-input-disabled) {
    border-color: @primary-color;
}
.contentOuter .ant-tree li .ant-tree-node-content-wrapper.ant-tree-node-selected {
    background-color: @box-shadow;
}
.contentOuter .ant-tree li .ant-tree-node-content-wrapper:hover {
    background-color: @box-shadow;
}
.contentOuter a {
    color: @primary-color;
}
#components-layout-demo-custom-trigger .trigger:hover {
    color: @primary-color;
}
.ant-layout-sider {
    background: @gray;
}
.ant-menu-dark, .ant-menu-dark .ant-menu-sub {
    color: @heading-color;
    background: @gray;
}
.ant-menu.ant-menu-dark .ant-menu-item-selected, .ant-menu-submenu-popup.ant-menu-dark .ant-menu-item-selected {
    background-color: @primary-color;
}
.ant-layout {
    background: white;
}
.ant-layout .ant-layout-header {
    box-shadow: 0 0 8px 0 rgba(0,0,0,10%);
    height: 60px;
}
.ant-layout-header  .header-text {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
}
.ant-layout-header #components-layout-demo-custom-trigger .trigger {
    font-size: 18px;
    line-height: 60px;
    padding: 0 24px;
    cursor: pointer;
    transition: color 0.3s;
}
.ant-pagination-item-active {
    font-weight: 500;
    background: @white;
    border-color: @primary-color;
}
.ant-btn:hover, .ant-btn:focus {
    color: @primary-color;
    background-color: @white;
    border-color: @primary-color;
}
.ant-spin {
    color: @primary-color;
}


/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: rgba(0,0,0,0.01);
    border-radius: 10px;
}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track {
    border-radius: 16px;
    background-color: rgba(0,0,0,0.01);
}

/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
    border-radius: 16px;
    background-color: rgba(0,0,0,0.05);
}

.contentOuter {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: auto;
}

.stdCol {
    position: relative;
    height: 100%;
    float: left;
}

.stdRow {
    position: relative;
    width: 100%;
    float: left;
}

.bd-R {
    border-right: 1px solid rgba(0,0,0,0.1);
}

.bd-B {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.bd-L {
    border-left: 1px solid rgba(0,0,0,0.1);
}

.bd-T {
    border-top: 1px solid rgba(0,0,0,0.1);
}

.pd-R {
    padding-right: 24px;
}

.pd-L {
    padding-left: 24px;
}

.pd-T {
    padding-top: 24px;
}

.pd-B {
    padding-bottom: 24px;
}

.of-V {
    overflow: hidden auto;
}

.of-H {
    overflow: auto hidden;
}
.of-all {
    overflow: hidden;
}

/* Login界面 */
.loginOuter {
    position: relative;
    height: 100vh;
    width: 100vw;
    text-align: center;
    background-size: 100%;
    background-color: #f7f7f7;
}
.jdyLogo {
    position: absolute;
    left: 5vw;
    top: 5vh;
    width: 10vw;
    cursor: pointer;
}
.loginInner {
    display: inline-block;
    margin-top: calc( 50vh - 225px - 30px );
    width: 770px;
    height: 450px;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 0 50px 0 rgba(0,0,0,0.2);
    text-align: center;
    box-sizing: border-box;
    overflow: hidden;
}
.loginPic {
    height: 100%;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}
.loginVersion {
    position: absolute;
    left: 62px;
    top: 140px;
    font-size: 12px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}
.loginVersionMobile {
    display: none;
}
.loginInputOuter {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
    padding: 30px 50px;
    background-color: white;
    text-align: center;
}
.loginWrapper {
    width: 100%;
}
.loginInput {
    width: 100%;
    margin-bottom: 16px;
    height: 40px;
    line-height: 40px;
    padding: 5px 10px;
    border-radius: 5px;
    background-color: white;
    outline:none;
    text-align: center;
    border: 1px solid rgba(25,25,25,0.5);
}
.loginBrandLogo {
    margin-top: 28px;
    width: 50px;
    margin-bottom: 16px;
}
.loginBrandName {
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 25px;
    width: 100%;
    text-align: center;
}
.loginBtn {
    width: 100%;
    margin-bottom: 16px;
    height: 40px;
    line-height: 40px;
    color: white;
    border-radius: 5px;
    background-color: @login-color;
    cursor: pointer;
    outline:none;
    text-align: center;
    border: 1px solid @login-color;
    transition: all 0.3s;
}
.loginBtn:hover {
    background-color: @primary-hover;
    border-color: @primary-hover;
}
.loginHelpOuter {
    width: 100%;
    text-align: center;
}
.loginHelp {
    display: inline-block;
    font-size: 14px;
    line-height: 20px;
    cursor: pointer;
    //text-decoration: underline;
    margin: 0 4px;
    transition: all 0.3s;
    color: rgba(0,0,0,0.5);
}
.loginHelp:hover {
    color: black;
}

/* Outer设定 */
.globalOuter {
    position: absolute;
    width: 100vw;
    height: 100vh;
}

.outerLogo {
    overflow: hidden;
    background: transparent !important;
}

.logoImg {
    height: 100%;
}

.outerExit {
    position: absolute;
    right: 0;
}
/* Tree页面 */
.treeOut-Title {

}
.treeOut-TitleInner {
    position: absolute;
    left: 0;
    top: -15px;
}
.treeOut-L-Add {
    position: absolute;
    right: 10px;
    top: 0;
    margin-bottom: 8px;
}
.treeOut-L-Search {
    margin-bottom: 8px;
    width: calc( 100% - 90px );
}
.treeOut-L {
    width: 25%;
}

.treeOut-R {
    width: 75%;
}
.addNodeForm {
    width: 100%;
}
.addNodeForm .ant-form-item {
    width: calc( 50% - 16px );
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative;
    float: left;
    margin-right: 16px;
}
.addNodeFormBtn {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #e9e9e9;
    padding: 10px 16px;
    background: @white;
    text-align: right;
    z-index: 1;
}

.treeForm-inputGroup .ant-form-item {
    width: calc( 25% - 16px );
    margin-top: 5px;
    margin-bottom: 5px;
}

.treeForm-inputGroup .ant-form-item-label {
    width: 30%;
    text-align: right;
}

.treeForm-inputGroup .ant-form-item-control-wrapper {
    width: 60%;
}

.treeForm-inputBtnGroup {
    text-align: right;
    height: 50px;
}

.treeForm-inputBtnGroup .ant-form-item {
    margin-right: 0;
    margin-left: 16px;
}

.treeForm-inputBoxTitle {
    position: absolute;
    left: 0;
    font-size: 20px;
    font-weight: 900;
    line-height: 50px;
}
.ant-input[disabled] {
    cursor: text;
    color: rgba(0, 0, 0, 0.75);
}
.ant-spin-nested-loading {
    height: 100%;
}
.ant-spin-container {
    height: 100%;
}

// Config 页面
.config-inputGroup {
    width: 300px;
}
.config-inputBtnGroup .ant-form-item {
    margin-right: 0;
}
.config-inputGroup .ant-form-item {
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
}

.config-inputGroup .ant-form-item-label {
    width: 40%;
    text-align: left;
}

.config-inputGroup .ant-form-item-control-wrapper {
    width: 60%;
}
.tableSpinning {
    width: 100%;
    height: 30vh;
}
.addNodeClose {
    position: absolute;
    height: 55px;
    width: 55px;
    right: 0;
    top: 0;
    text-align: center;
    cursor: pointer;
}
.addNodeClose i {
    position: absolute;
    top: 2px;
    right: 0;
    height: 100%;
    width: 100%;
    padding: 19px 20px 21px 20px;
}
.addNodeClose svg {
    position: relative;
    height: 18px;
    width: 18px;

}

.iframe {
    height: 100%;
    width: 100%;
    border: none;
}
.iframe .fx-dashboard-entry-view .content-header{
    display: none;
}
.iframeOuter {

}

/* 1500px尺寸以下电脑小屏幕自适应 */
@media screen and ( max-width: 1500px ){
    .treeForm-inputGroup .ant-form-item {
        width: calc( 33% - 16px );
    }
    .treeForm-inputGroup .ant-form-item-label {
        width: 40%;
    }
    .treeForm-inputGroup .ant-form-item-control-wrapper {
        width: 60%;
    }
}
/* 竖屏自适应（小于2:3比例） */
@media screen and (max-aspect-ratio:~"2/3") {
    .globalOuter {
        overflow: hidden;
    }
    html, body {
        overflow: hidden;
    }
    .jdyLogo {
        display: none;
    }
    .loginInner {
        height: 100%;
        width: 100%;
        margin: 0;
        border-radius: 0;
    }
    .loginInner .stdCol:nth-child(1) {
        display: none;
    }
    .loginInner .stdCol {
        width: 100% !important;
        height: 100% !important;
    }
    .loginPic {
        display: none;
    }
    .loginVersionMobile {
        display: block;
    }
    .loginVersionMobile:nth-last-of-type(2) {
        margin-top: 25vh;
    }
    .loginInputOuter {
        padding: 15vw 10vw 10vw 10vw  ;
    }
    .ant-layout-sider-collapsed {
        width: 0 !important;
        min-width: 0 !important;
        flex: 0 0 0 !important;
        overflow: hidden;
    }
    .outerExit {
        top: 0;
    }
    .ant-layout-header .header-text {
        display: none;
    }


}
